@charset "UTF-8";
@import "compass";
@import "./aboutqian";

.scroll {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    .step {
        width: 100%;
        height: 100%;
        overflow: hidden;
        position: absolute;
        -webkit-transform: translate3d(0, 0, 0);
        left: 0;
        top: 0;
        ;
        -webkit-transition: -webkit-transform 300ms ease-out;
    }
}

.swipe-list-1 {
    background: #eeddeb;
    z-index: 2;
    .logo_img {
        img {
            position: absolute;
            display: block;
            width: 6rem; // 450px
            height: 7.92rem; // 594px
            left: 50%;
            top: 50%;
            margin-left: -3rem;
            margin-top: -3.96rem;
        }
    }
}

.swipe-list-2 {
    z-index: 1;
    padding-top: 1.03rem;
    background-color: #eeddeb;
    .icons_wrap {
        overflow: hidden;
        height: 2rem; // 150px
        width: 8rem; // 600px
        margin: 0 auto;
        .icon_txts {
            color: #585757;
            font-family: "Microsoft YaHei";
            display: block;
            margin-top: 1.67rem; // 125px
            font-size: .27rem; // 20px
            text-align: center;
        }
        .active {
            color: #a04f90;
        }
        .icon-1 {
            background: url(../img/circle_03.png) no-repeat;
        }
        .icon-2 {
            background: url(../img/circle_01.png) no-repeat;
        }
        .icon-3 {
            background: url(../img/circle_02.png) no-repeat;
        }
        .icon-4 {
            background: url(../img/circle_04.png) no-repeat;
        }
        .icons {
            width: 1.44rem; // 108px
            height: 1.45rem; // 109px
            float: left;
            display: block;
            margin: 0 .27rem; // 20px
            background-size: 100%
        }
    }
    .tit {
        width: 9.07rem; // 680px
        margin: .53rem auto 0 auto; // 40px auto;
        p {
            font-size: .33rem; // 25px
            color: #3da0ae;
            text-align: center;
        }
        p:last-child {
            margin-top: .2rem; // 15px
        }
    }
    .videobg {
        position: relative;
        margin-top: .8rem; // 60px
        img {
            margin: 0 auto;
            width: 100%;
            height: 11.6rem; // 870px
        }
        .j_video_btn {
            position: absolute;
            bottom: 4.35rem; // 326px
            width: 2.53rem; // 190px
            height: 2.27rem; // 170px
            display: block;
            left: 50%;
            margin-left: -1.2rem;
        }
    }
}

* {
    -webkit-transform: all 1s;
    transform: all 1s;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-direction: normal;
    animation-direction: normal;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

@-webkit-keyframes zoomIn {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3);
    }
    50% {
        opacity: 1;
    }
}

@keyframes zoomIn {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3);
    }
    50% {
        opacity: 1;
    }
}

.zoomIn {
    -webkit-animation-name: zoomIn;
    animation-name: zoomIn;
}

@-webkit-keyframes ball {
    0% {
        -webkit-transform: translateY( 0);
        transform: translateY( 0);
    }
    100% {
        -webkit-transform: translateY( -10px);
        transform: translateY( -10px);
    }
}

@keyframes ball {
    0% {
        -webkit-transform: translateY( 0);
        transform: translateY( 0);
    }
    100% {
        -webkit-transform: translateY( -10px);
        transform: translateY( -10px);
    }
}
